<template>
	<view class="bi-image-ocr" @click="handleClick">
		<slot :loading="loading" :base64="base64">
			<ui-loading v-if="loading" dir="horizon" size="mini" text="正在识别中..."></ui-loading>
			<view class="bi-image-ocr__handle" v-else>
				<view class="bi-image-ocr__icon"></view>
				<view class="bi-image-ocr__text">{{ text }}</view>
			</view>
		</slot>
	</view>
</template>

<script>
import { error, success } from '@/utils/message.js'
import { compressionImage } from '@/utils/file.js'

export default {
	name: 'BiImageOcr',
	props: {
		image: {
			type: String
		},
		type: {
			type: String,
			validator (value) {
				return ['vehicleLicense', 'vehicleGps'].includes(value)
			}
		},
		text: {
			type: String,
			default: '选择图片识别'
		}
	},
	data () {
		return {
			base64: null,
			loading: false
		}
	},
	methods: {
		handleClick () {
			//选择图片
			wx.chooseImage({
			   count: 1,
			   sizeType: ['compressed'],
			   sourceType: ['album', 'camera'],
			}).then(res1 => {
				if (Array.isArray(res1)) {
					res1 = res1.find(v => !!v)
				}
				this.loading = true
				compressionImage({
					size: res1.tempFiles[0].size,
					path: res1.tempFiles[0].path
				}, 1 * 1024 * 300).then((res2) => {
					const buffer = wx.getFileSystemManager().readFileSync(res2.path)
					this.base64 = 'data:image/jpeg;base64,' + wx.arrayBufferToBase64(buffer)
					if (this.type === 'vehicleLicense') {
						wx.cloud.callFunction({
							name: 'vehicleLicenseOCR', 
							data: {
								imgUrl: wx.cloud.CDN(buffer)
							},
							success: (res) => {
								this.loading = false
								if (!res || !res.result) {
									error('识别失败')
									return
								}
								if (!res.result.plateNum) {
									error('未识别到有效车牌号码')
									return
								}
								this.$emit('resolve', {
									data: {
										addr: res.result.addr,
										model: res.result.model,
										owner: res.result.owner,
										plateNum: res.result.plateNum,
										registerDate: res.result.registerDate,
										vehicleType: res.result.vehicleType
									}
								})
							},
							fail: (err) => {
								this.loading = false
								let message = '未知错误'
								if (err.message) {
									message = err.message
								} else if (err.errMsg) {
									message = err.errMsg
								}
								error(message)
							},
							complete: () => {
								this.loading = false
							}
						})
					} else if (this.type === 'vehicleGps') {
						wx.cloud.callFunction({
							name: 'printedTextOCR',
							// data: {
							// 	img: {
							// 		'contentType': 'image/png',
							// 		'value': buffer
							// 	}
							// },
							data: {
								imgUrl: wx.cloud.CDN(buffer)
							},
							success: (res) => {
								this.loading = false
								if (!res || !res.result) {
									error('识别失败')
									return
								}
								const item = (res.result.items || []).find(v => v.text.toLocaleLowerCase().indexOf('sn:') >= 0)
								if (!item) {
									error('未识别到有效条形码')
									return
								}
								const snCode = item.text.match(/sn:(\w+)/i)[1]
								if (!snCode) {
									error('未解析出条形码')
									return
								}
								this.$emit('resolve', {
									data: {
										snCode
									}
								})
							},
							fail: (err) => {
								this.loading = false
								let message = '未知错误'
								if (err.message) {
									message = err.message
								} else if (err.errMsg) {
									message = err.errMsg
								}
								error(message)
							},
							complete: () => {
								this.loading = false
							}
						})
					}
				}, (err) => {
					error('压缩失败')
					this.loading = false
				})
			})
		}
	}
}
</script>

<style lang="less">
.bi-image-ocr{
}
.bi-image-ocr__handle{
	display: flex;
	flex-direction: row;
	align-items: center;
	line-height: 24px;
	height: 24px;
}
.bi-image-ocr__icon{
	height: 16px;
	width: 16px;
	margin-right: 6px;
	background: url('./icon.png') no-repeat 50% 50%;
	background-size: cover;
}
.bi-image-ocr__text{
	color: #2570FF;
}
</style>